<template>
    <div id="list">

      <ul class="mui-table-view" v-for="item in list" :key="item.id">
        <li class="mui-table-view-cell mui-media">
          <a @click="toDetail(item.id)">
            <img class="mui-media-object mui-pull-left" :src="item.img">
            <div class="mui-media-body">
              {{ item.title }}
              <p class='mui-ellipsis'>
                {{ item.summary }}
              </p>
            </div>
          </a>
        </li>
      </ul>

    </div>
</template>

<script>
    export default {
        name: "listDetail",
      data(){
        return {
          list:{}
        }
      },
      props:['detailId'],
      created(){
        console.log(this.detailId)
        this.$axios.get('/share/categary?id=' + this.detailId)
          .then(res => {
            this.list = res.data.list;
          })
          .catch(err => console.log(err))
      },
      methods:{
        toDetail(id){
          this.$router.push({
            name:"picDetail",
            params:{id:id}}
          )
        }
      }
    }
</script>

<style scoped>

  #list{
    margin-bottom: 50px;
  }
</style>
